<div class="row" *ngIf="zone$ | async as zone">
	<div class="col-md-12 col-xl-4">
		<m-card [autoHeight]="true">
			<ng-container card-head>
				<m-key-search [label_text]="'区内人员'" #personnelSearchRef> </m-key-search>
			</ng-container>
			<m-zone-personnel-list
				class="h-100"
				[searchControl]="personnelSearchRef"
				[zone]="zone"
			></m-zone-personnel-list>
		</m-card>
	</div>
	<div class="col-md-6 col-xl-4">
		<m-card [autoHeight]="true">
			<ng-container card-head>
				<m-key-search [label_text]="'区内终端'" #computerSearchRef> </m-key-search>
			</ng-container>
			<m-zone-computer-list
				class="h-100"
				[searchControl]="computerSearchRef"
				[zone]="zone"
			></m-zone-computer-list>
		</m-card>
	</div>
	<div class="col-md-6 col-xl-4">
		<m-card [autoHeight]="true">
			<ng-container card-head>
				<m-key-search [label_text]="'区内软件'" #softwareSearchRef> </m-key-search>
			</ng-container>
			<m-zone-software-list
				class="h-100"
				[searchControl]="softwareSearchRef"
				[zone]="zone"
			></m-zone-software-list>
		</m-card>
	</div>
</div>
